<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>article_all</title>
    <link rel="stylesheet" href="./css/public.css">
    <style>
        body{
            background: #F0F3F4;
        }
        .container{
            margin: 25px 25px;
        }
        .head{
            display: flex;
            justify-content: space-between;
            padding: 5px 20px;
            background: #d7ebf1;
            line-height: 30px;
            font-size: 18px;
        }
        .article_related{
            display: flex;
            justify-content: space-between;
            width: 20%;
        }
        .single_article{
            border: 1px solid #c7d5da;
            box-shadow: 0 0 1px 0 rgba(0,0,0,.2);
            margin-bottom: 30px;
        }
        .body{
            text-indent: 2em;
            font-size: 16px;
            padding: 5px 10px;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 3;
            overflow: hidden;
        }
        .bottom{
            height: 30px;
        }
    </style>
</head>
<body>
    <div class="container">
    </div>
    <div class="bottom"></div>
    <script src="./node_modules/axios/dist/axios.js"></script>
    <script>
        axios.get('https://ty.php800.cn/api/token.php',{
            headers:{
                TOKEN:localStorage.getItem('token'),
                SAT:'1234567'
            }
        }).then((res)=>{
            console.log(res)
            if(!res.data.verify){
                top.window.location.href='./login.html'
            }
        })
    </script>
    <script>
        function addzero(date){
            return date<10?'0'+date:date
        }
        function $(selector){
            return document.querySelector(selector)
        }
        axios.get('https://ty.php800.cn/api/article/list.php',{
            headers:{
                SAT:'1234567'
            }
        }).then((res)=>{
            console.log(res.data.blogs.length)
            for (var i = 0; i < res.data.blogs.length; i++) {
                const {id,userid,datetime,classid,title,body} = res.data.blogs[i];
                let date=new Date(parseInt(datetime))
                date=date.getFullYear()+'年'+addzero(date.getMonth()+1)+'月'+addzero(date.getDate())+'日&nbsp;&nbsp;&nbsp;&nbsp;'+addzero(date.getHours())+':'+addzero(date.getMinutes())+":"+addzero(date.getSeconds())
                let div=document.createElement('div')
                div.classList.add('single_article')
                div.innerHTML=`
                <div class="head">
                    <div class="title">${title}</div><div class="datetime">${date}</div>
                </div>
                <div class="body">${body}</div>
                `
                $('.container').appendChild(div)
                let thisone=JSON.stringify(res.data.blogs[i])
                div.onclick=function(){
                    location.href='./detail_article.html'
                    localStorage.setItem('thisone',thisone)
                    console.log(localStorage.thisone)
                }
            }
        });
    </script>
</body>
</html>